Skip to content

[drawer] Place a swipe-opened popup under the pointer on its first frame - #6109

Open
atomiks wants to merge 3 commits into
mui:masterfrom
atomiks:claude/drawer-swipe-open-first-frame
Open

atomiks wants to merge 3 commits into
mui:masterfrom
atomiks:claude/drawer-swipe-open-first-frame

Conversation

@atomiks

@atomiks atomiks commented Oct 27, 2026 •

Copy link
Copy Markdown
Contributor

Fixes #6105

A drawer opened by a swipe on Drawer.SwipeArea painted its first frame away from the pointer. The popup mounts one commit after open flips, and the swipe area neither re-rendered in that commit nor re-applied a movement it had never managed to apply, so the popup had no --drawer-swipe-movement-* until the next pointermove. It also mounted with data-starting-style, whose transform in the documented styles overrides the movement for that frame.

This PR subscribes the swipe area to popupElement and applies the movement in that commit when the swipe opened the drawer (as proposed by @klemenoslaj in the issue), and removes the popup's starting style once the swipe places it, since it then follows the pointer instead of transitioning in. A flick that only opens the drawer on release keeps its starting style and transitions in as before.

@atomiks atomiks added component: drawer Changes related to the drawer component. type: bug It doesn't behave as expected. labels Oct 27, 2026
@pkg-pr-new

pkg-pr-new Bot commented Oct 27, 2026 •

Copy link
Copy Markdown

commit: f771d6c

@code-infra-dashboard

code-infra-dashboard Bot commented Oct 27, 2026 •

Copy link
Copy Markdown

Bundle size

Bundle Parsed size Gzip size
@base-ui/react 🔺+92B(+0.02%) ▼-3B(0.00%)

Details of bundle changes

Performance

No regressions in 36 benchmarks · ran 3m 57s · details


Check out the code infra dashboard for more information about this PR.

@netlify

netlify Bot commented Oct 27, 2026 •

Copy link
Copy Markdown

✅ Deploy Preview for base-ui ready!

Name Link
🔨 Latest commit f771d6c
🔍 Latest deploy log https://app.netlify.com/projects/base-ui/deploys/6af2a3acd05a2c38c4a33892
😎 Deploy Preview https://deploy-preview-6109--base-ui.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

@atomiks
atomiks marked this pull request as ready for review October 29, 2026 06:41
@atomiks
atomiks force-pushed the claude/drawer-swipe-open-first-frame branch from f605f46 to f771d6c Compare November 10, 2026 04:55
@atomiks
atomiks enabled auto-merge (squash) November 10, 2026 04:56

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

component: drawer Changes related to the drawer component. type: bug It doesn't behave as expected.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

A popup opened by a swipe on Drawer.SwipeArea paints one frame at its closed position

1 participant